<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>租乐宝详情页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.0/css/jquery-weui.min.css">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="common/css/font-awesome.min.css">
    <link rel="stylesheet" href="common/css/swiper.min.css">
    <link rel="stylesheet" href="common/css/main.css">
    <link rel="stylesheet" href="common/css/item.css">
    <link rel="stylesheet" href="common/css/cart.css">
    <link rel="stylesheet" href="common/css/theme-color.css">
    <link rel="stylesheet" href="common/css/style.css">

</head>
<body>

<section class="aui-flexView">
    <header class="zyw-header">
        <div class="zyw-container white-color">
            <div class="head-l"><a href="javascript:window.history.back(-1)" target="_self"><img src="common/images/icon/head-return.svg" alt=""></a></div>
            <div class="head-r"><img src="common/images/icon/head-more.svg" alt=""></div>
        </div>
    </header>

    <section class="zyw-footer">
        <div class="zyw-container white-bgcolor clearfix">
            <div class="col-sm-2 col-xs-2"></div>
            <div class="col-sm-2 col-xs-2"></div>
            <div class="col-sm-2 col-xs-2"></div>

            <div class="col-sm-3 col-xs-3">
                <button id="rent" type="submit" class="footer-btn footer-warning" onclick="rentConfirm()">租赁</button>
            </div>
            <div class="col-sm-3 col-xs-3">
                <button id="purchase" type="submit"  class="footer-btn footer-danger" onclick="buyConfirm()">购买</button>
            </div>
        </div>
    </section>
    <section class="zyw-container">

        <div class="item-img">
            <div class="swiper-wrapper"></div>
            <div class="swiper-pagination"></div>
        </div>
        <div class="item-details white-bgcolor clearfix">
            <h3 class="details-title" id="introduction"></h3>
            <strong class="details-prince theme-color pull-left" >租用:￥<lable id="rentPrice" class="details-volume"></lable>/天&nbsp;&nbsp;&nbsp;&nbsp;</strong>

            <strong class="details-prince theme-color pull-left" >购买:￥<lable id="buyPrice" class="details-volume pull-right"/></strong>
            <span class="details-volume pull-right" >余量:<lable id="remainder" class="details-volume pull-right"/>件</span>
        </div>
        <div class="item-choose weui-cells mt-625">
            <a class="weui-cell weui-cell_access open-popup" href="javascript:" data-target="#item_spec">
                <div class="weui-cell__bd">
                    <p class="choose-text">选择 <span id="colorspan">购买数量</span></p>
                </div>
                <div class="weui-cell__ft choose-des">
                </div>
            </a>
            <div id="item_spec" class="weui-popup__container popup-bottom">
                <div class="weui-popup__overlay"></div>
                <div class="weui-popup__modal">
                    <div class="item-spec-layer white-bgcolor">
                        <div class="spec-head clearfix">
                            <div class="spec-head-img"></div>
                            <strong class="details-prince theme-color pull-left" >租用:￥<lable id="rentPrice2" class="details-volume"></lable>/天&nbsp;&nbsp;&nbsp;&nbsp;</strong>
                            <strong class="details-prince theme-color pull-left" >购买:￥<lable id="buyPrice2" class="details-volume pull-right"/></strong>
                        </div>
                        <div class="spec-head clearfix">
                            <div class="spec-info-hd">数量</div>
                            <ul class="btn-numbox">
                                <li style="padding-left: 21px;">
                                    <ul class="count">
                                        <li><span id="num-jian" class="num-jian" onclick="minus()">-</span></li>
                                        <li><input type="text" class="input-num" id="input-num" value="0"/></li>
                                        <li><span id="num-jia" class="num-jia" onclick="add()">+</span></li>
                                    </ul>
                                </li>
                                <li><span class="kucun" ></span>(库存:<label class="kucun" id="kucun"></label>)</li>
                                　　　       </ul>

                        </div>
                        <p>&nbsp;</p>

                        <div class="weui-cell__ft">
                            <div class="weui-count">
                                <a class="weui-count__btn weui-count__decrease"></a>
                                <input class="weui-count__number" type="number" value="1">
                                <a class="weui-count__btn weui-count__increase"></a>
                            </div>
                        </div>

                        <button class="item-layer-button theme-bgcolor white-color close-popup" type="submit" onclick="info()">确定</button>
                        <a href="javascript:" class="close-popup spec-close"><i class="fa fa-close"></i></a>
                    </div>
                </div>
            </div>
            <a class="weui-cell weui-cell_access open-popup" href="javascript:" data-target="#item_parameter">
                <div class="weui-cell__bd">
                    <p class="choose-text">产品参数</p>
                </div>
                <div class="weui-cell__ft choose-des">
                </div>
            </a>
            <div id="item_parameter" class="weui-popup__container popup-bottom">
                <div class="weui-popup__overlay"></div>
                <div class="weui-popup__modal">
                    <div class="item-parameter-layer white-bgcolor">
                        <h3 class="parameter-title">产品参数</h3>
                        <table class="table table-condensed parameter-table">
                            <tr>
                                <th>品牌</th>
                                <td>和互帮</td>
                            </tr>
                            <tr>
                                <th>生产厂家</th>
                                <td id="productFactory"></td>
                            </tr>
                            <tr>
                                <th>生产日期</th>
                                <td>2018-01-01</td>
                            </tr>
                           <!-- <tr>
                                <th>报废日期</th>
                                <td>2020-01-01</td>
                            </tr>-->
                        </table>
                        <button class="item-layer-button theme-bgcolor white-color close-popup" type="submit">完成</button>
                    </div>
                </div>
            </div>
        </div>

    </section>
    <!--<footer class="aui-footer">
        <a href="index.html" class="aui-tabBar-item aui-tabBar-item-active">
                    <span class="aui-tabBar-item-icon">
                        <i class="icon icon-index"></i>
                    </span>
            <span class="aui-tabBar-item-text">首页</span>
        </a>
        <a href=" views/product/submitOrder.html;" class="aui-tabBar-item ">
                    <span class="aui-tabBar-item-icon">
                        <i class="icon icon-cart"></i>
                    </span>
            <span class="aui-tabBar-item-text">购物车</span>
        </a>
        <a href="javascript:;" class="aui-tabBar-item ">
                    <span class="aui-tabBar-item-icon">
                        <i class="icon icon-order"></i>
                    </span>
            <span class="aui-tabBar-item-text">订单</span>
        </a>
        <a href="javascript:;" class="aui-tabBar-item ">
                    <span class="aui-tabBar-item-icon">
                        <i class="icon icon-home"></i>
                    </span>
            <span class="aui-tabBar-item-text">个人中心</span>
        </a>

    </footer>-->

</section>




<script src="common/js/my.js"></script>
<script src="common/js/AjaxJson.js"></script>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.0/js/jquery-weui.min.js"></script>
<script src="common/js/bootstrap.min.js"></script>
<script src="common/js/swiper.min.js"></script>
<script>
    var swiper = new Swiper('.item-img', {
        autoplay:true,
        delay: 7000,
        slidesPerView: 1,
        spaceBetween: 0,
        keyboard: {
            enabled: true,
        },
        pagination: {
            el: '.swiper-pagination',
            type: 'fraction',
        },
    });
    var MAX = 10, MIN = 1;
    $('.weui-count__decrease').click(function (e) {
        var $input = $(e.currentTarget).parent().find('.weui-count__number');
        var number = parseInt($input.val() || "0") - 1;
        if (number < MIN) number = MIN;
        $input.val(number)
    });
    $('.weui-count__increase').click(function (e) {
        var $input = $(e.currentTarget).parent().find('.weui-count__number');
        var number = parseInt($input.val() || "0") + 1;
        if (number > MAX) number = MAX;
        $input.val(number)
    });
</script>
</body>
</html>